<!DOCTYPE html>
<html>
<head>
    {include file='public/meta'/}
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/setyxhd.css?v=5"/>
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/fonts/css/font-awesome.css?v=3"/>




</head>
<body>
{include file='public/header'/}
<!------------------导航-------------------------->
<section id="content">
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">
        <div class="page-heading mgl15 mgr15">
            <ol class="breadcrumb">
                <li>
                    当前位置是&nbsp;:
                </li>
                <li><a href="javascript:history.back();">营销工具</a></li>
                <li><a href="javascript:history.back(-1)">活动营销</a></li>
                <li class="active" style="color: #02b87f;">开卡有礼</li>
            </ol>
        </div>
        <div class="panel panel-default ng-scope mgl15 mgr15">
            <div class="panel-heading">
                开卡有礼规则列表
            </div>
            <div class="alert alert-success"
                 style="background-color: rgba(204, 228, 223, 0.3);margin-top: 10px;margin-bottom: -10px;margin: 5px 10px -5px 10px;">
                <strong>
                    <i class="ti-info-alt"></i>
                </strong>
                如会员卡使用了一键开卡，则发布开卡有礼规则时最好不超过五张不同的卡券，超过五张的部分推送的消息将可能不予显示，但不影响设定的领卡规则及内容。
                发布之后开始时间将不再生效，只将生效结束时间。
            </div>
            <div class="panel-body">
                <table class="table table-bordered">
                    <thead>
                    <tr>
                        <td>编号</td>
                        <td>开始时间</td>
                        <td>结束时间</td>
                        <td>赠送卡券</td>
                        <td>创建时间</td>
                        <td>当前状态</td>
                        <td class="text-center">操作</td>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="rutlist" id="vor"}
                    <tr ng-if="!instances.list.length" class="ng-scope">
                        <td>{$vor.id}</td>
                        <td>{$vor.begin_time|date="Y-m-d",###}</td>
                        <td>{$vor.end_time|date="Y-m-d",###}</td>
                        <td>{:getpaygive($vor['card_id_list'],0)}</td>
                        <td>{$vor['create_time']}</td>
                        <td>{if condition="$vor['statu']=='1' "}开启{else/}关闭{/if}</td>
                        <td>
                            <a class="btn-link"
                               href="{:url('marke/firegivesta',['id'=>$vor['id'],'statu'=>$vor['statu'],'card_id'=>$card['card_id']])}">
                                {switch name="vor.statu"}
                                {case value="1"}已开启{/case}
                                {case value="2"}已关闭{/case}
                                {default /}未知
                                {/switch}
                                |</a>
                            {switch name="vor.is_put"}
                            {case value="1"} <a class="btn-link" href="javascript:;" id="fabu">

                            已发布 |{/case}

                            {case value="0"}<a class="btn-link" href="javascript:;" onclick="putfirecard('{$vor.id}')"
                                               id="fabu" data-no="{$vor['card_no']}">

                            发布 |{/case}
                            {default /}未知
                            {/switch}
                        </a>
                            <a class="btn-link"
                               href="{:url('marke/firegivedel',['id'=>$vor['id'],'card_id'=>$card['card_id']])}">删除</a>
                        </td>
                    </tr>
                    {/volist}
                    </tbody>
                </table>
            </div>
        </div>

        <div class="panel-body ">
            <div class="panel panel-default ng-scope c_content ">


                <div class="headings gengduoxian">
                    <i class="infoLine"></i>开卡有礼规则列表 <span class="note-inf">带<a style="color:red;"> * </a>为必填项</span>
                </div>
                <form class="form-horizontal" action="" method="post"  id="formcate">
                    <input type="hidden" name="type" value="1">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-horizontal" data-label="活动时间"
                                 data-layout="horizontal">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label"><span class="red-xing-rs"></span>活动时间：</label>
                                    <div class="col-sm-10">
                                        <div class=" w60">
                                            <input type="text" name="give_date" class="form-control data_ipt" value=""
                                                   placeholder="请选择开始时间-结束时间" disabled id="give_date">


                                        </div>

                                        <div class="checkbox checkbox-primary permanent"
                                             style="left: 41px;top: 4px;display: inline-block;">
                                            <input type="hidden" name="time_type" value="lasting" id="lasting">
                                            <input id="permanent_ck" type="checkbox"
                                                   class="autoDelayFlag" checked>
                                            <label for="permanent_ck">永久有效</label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="form-horizontal" data-layout="horizontal">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label"><span class="red-xing-rs"></span>活动奖品：</label>
                                    <div class="col-sm-10">

                                        <div style=" margin-top:3px;">

                                            <div class="checkbox checkbox-info checkbox-inline prize">
                                                <input type="hidden" id="iscards" value="N"
                                                       name="is_cards">

                                                <input type="checkbox" id="cards" class="gift-input" >
                                                <label for="cards"> 赠送优惠券 </label>
                                                <span class="container " style="display:none;" coupontype="0">
   <a href="javascript:;" data-counts="1" id="datacount"
      style="color: #2db7f5;font-size: 13px;">添加赠送</a>
                                                            <div class="col-xs-10 col-sm-10 col-md-10 form1">
                                    <div class="gift-record" id="sel1">
                                        <select name="card_arr[zs_card_id][]" class="form-control cardsel" id="opt">
                                            <option value="">--请选择--</option>
                                        </select>
                                        <input type="number" class="form-control" min="1" placeholder="请填写" value="1"
                                               name="card_arr[zs_no][]" data="num" id="num">
                                    </div>

                                </div>

                                                            </span>
                                            </div>


                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label ng-binding"><span
                                        class="red-xing-rs"></span>状态：</label>
                                <div class="col-sm-8">
                                    <select name="statu" id="" class="form-control">
                                        <!--<option value="">&#45;&#45;请选择&#45;&#45;</option>-->
                                        <option value="1">开启</option>
                                        <option value="2">关闭</option>
                                    </select>
                                    <div class="r-message text-danger ng-scope ng-inactive"></div>
                                </div>
                            </div>


                            <div class="panel-footer">
                                <button class="btn btn-success" type="button" onclick="check()">保存</button>
                            </div>
                        </div>
                    </div>
                </form>

            </div>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel" style="font-size: 16px;">提示</h4>

            </div>
            <div class="modal-body">
                <div class="table-responsive">
                    <h5 style="text-align: center;" id="text">超过五张不同的卡券部分推送的消息将可能再消息中不予显示，但不影响设定的领卡规则及发送数量，是否发布。</h5>

                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">返回</button>

                <button type="button" class="btn btn-primary" onclick="btn()" data-gid="" id="gid">确定</button>
            </div>
        </div>
    </div>
</div>

<script src="__STATIC_URL__/static/laydate/laydate.js"></script>
<script src="__STATIC_URL__/static/js/setyxhd.js?v=3"></script>
<script>
    laydate.render({
        elem: '#give_date',
        type: 'datetime',
        range: true,
        change: function (value, date, endDate) { //监听日期被切换

        }
    });

</script>
<script>
    function putfirecard(gid) {
        var no = parseInt($("#fabu").attr("data-no"))
        console.log(no);
        $("#gid").attr("data-gid", gid);
        if (no > 5) {
            $('#myModal').modal('show');
        } else {
            btn();
        }

    }

    function btn() {
        var gid = $("#gid").attr("data-gid");

        $.ajax({
            url: "{:url('marke/firegives')}",			//提交事件
            type: "post",						//方式
            data: {
                give_id: gid
            },		//表单ID
            success: function (data) {			//接收返回值
                console.log(data);

                if (data.code == 0) {
                    $("#fabu").text("已发布 | ");
                    $("#fabu").attr("onclick", "");
                    layer.alert("发布成功");
                    $('#myModal').modal('hide');
                }
                if (data == 1) {
                    layer.alert("发布失败");
                }
            }
        });
    }
</script>

<script>
    $(function () {
        $.ajax({
            url: "{:url('cards/getcardlist')}",
            type: "post",
            data: {},
            success: function (data) {

                var text = data.data;
                //console.log(text);
                var option2 = "";
                for (var i = 0; i < text.length; i++) {
                    // console.log(text[i].card_id);

                    option2 += '<option value="' + text[i].card_id + '" data-title="' + text[i].title + ' "data-limit="' + text[i].get_limit + '">' + text[i].title + '  ( 最大可选卡券数量为' + text[i].get_limit + ' )</option>\n'

                }
                $('#sel1').find("select").append(option2);
                $("#opt").change(function () {

                    limit = parseInt($("#sel1").find("option:selected").attr("data-limit"));
                    var nu = parseInt($("#num").val());

                    $("#num").attr("max", limit);
                    //console.log(333333,limit);


                });

                $("#datacount").click(function () {


                    datacount = $(this).attr('data-counts');
                    get_limit = parseInt($("#sel" + datacount).find("option:selected").attr("data-limit"));
                    num = parseInt($("#sel" + datacount).find("input").val());
                    val = $("#sel" + datacount).find("option:selected").val();
                    if ($("#sel" + datacount).find("option:selected").val() == "") {
                        alert("卡券选项不能为空");
                        return;
                    }
                    else if (num > get_limit) {
                        console.log(num, get_limit);
                        console.log(num > get_limit);
                        alert("你选择的卡券数量超过了该卡券的领取数量!");
                        return;
                    }
                    else {

                        datacount2 = parseInt(datacount) + 1;
                        $(this).attr('data-counts', datacount2);
                        var html1 = '                        <div class="col-xs-12 col-sm-12 col-md-12 addcord" >\n' +
                            '                            <div class="gift-record"id="sel' + datacount2 + '">\n' +
                            '                                <select name="card_arr[zs_card_id][]"  class="form-control" >\n' +
                            '                                    <option value="" selected="selected">--请选择--</option>\n';

                        var html3 = '                                </select>\n' +
                            '                                <input type="number" class="form-control" min="1" placeholder="请填写" value="1" name="card_arr[zs_no][]">\n' +
                            '                            </div>\n' +
                            '                             <a href="javascript:;" onclick="delsel(this)" style="font-size: 13px;">删除</a>\n' +
                            '                    </div>';

                        $('.form1').append(html1 + option2 + html3);

                        $("#sel" + datacount2).find("select").change(function () {

                            limit = $("#sel" + datacount2).find("option:selected").attr("data-limit");
                            $("#sel" + datacount2).find("input").attr("max", limit);


                        });

                    }


                })
            }
        })


    })
</script>
<script>
    function check() {


        var items = document.getElementsByTagName('select'),
            len = items.length,
            i = 0,
            valMap = {},
            sel,
            val;

        // 遍历并保存各个下拉列表的值于valMap
        for (; i < len; i++) {
            sel = items[i];
            val = sel.options[sel.selectedIndex].value;

            // 没有相同的取值时保存该值，否则返回false
            if (!valMap[val]) {
                valMap[val] = 1;
            } else {
                alert('请删除重复的卡券！');
                return false;
            }

        }
        var va = $("#opt").val();
        var give_date = $("#give_date").val();

        if ($('#permanent_ck').prop("checked")==false) {
            if (give_date === "") {

                layer.alert(" 请选择时间！");
                return false;
            }
        }


        if (va == "") {
            layer.alert(" 请选择卡券！");
            return false;
        }
        // 校验通过，全部都不相同


        $.ajax({
            url: "{:url('')}",
            type: "post",
            data: $("#formcate").serialize(),
            success: function (data) {
                console.log(data);
                if(data.code==0){
                    layer.msg(data.message);
                    setTimeout(function(){
                        window.location.reload();
                    },1500)
                }else{
                    layer.msg(data.message);
                }
            }
        })
    }

</script>
<script>

</script>
<script>

    function delsel(obj) {
//
        $(obj).parent().remove();


    }

</script>
</body>

</html>
